<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <script src="__STATIC__/js/base.js"></script>
    <title>服务商加盟-个人</title>
    <link rel="stylesheet" href="__STATIC__/css/base.css">
    <link rel="stylesheet" href="__STATIC__/css/privider.css">
    <link rel="stylesheet" href="__STATIC__/js/layer_mobile/need/layer.css">
    <script src="__STATIC__/js/jquery-1.11.1.min.js"></script>
    <script src="__STATIC__/js/form_validation.js"></script>
    <script src="__STATIC__/js/layer_mobile/layer.js"></script>
    <script src="__STATIC__/js/layer/layer.js" type="text/javascript"></script>
</head>
<style type="text/css">
    .input-inline .formcontent .inputstyle1{
        background: transparent;
    }
</style>
<body>
<section class="wrap " style="background: white">
    <div  class="add-privider">
        <span class="add-privider-title" >填写个人资料</span>
    </div>
    <div  class="privider-form">
        <form id="form1">
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">用户名：</div>
                    <div class="formcontent pull-left">
                        <input tabindex="1"  id="user_name_a" class="inputstyle1" autocomplete="off" type="text" name="memberName" placeholder="请输入用户名" value="{$user.memberName ? $user.memberName :''}"/>
                        <span class="success"></span>
                    </div>
                </div>
            </div>
            <input type="hidden" name="districtId">
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">服务商名称：</div>
                    <div class="formcontent pull-left">
                        <input tabindex="1"  id="service_name" class="inputstyle1" autocomplete="off" type="text" name="providerName" placeholder="请输入服务商名称" value="{$user.providerName ? $user.providerName :''}"/>
                        <span class="success"></span>
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline ">
                    <div class="formtitle pull-left">真实姓名：</div>
                    <div class="formcontent pull-left ">
                        <input tabindex="1"  id="real_name" class="inputstyle1 " autocomplete="off" type="text" name="realName" placeholder="请输入真实姓名" value="{$user.realName ? $user.realName :''}"/>
                        <span class="success"></span>
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">身份证号：</div>
                    <div class="formcontent pull-left">
                        <input tabindex="1"  id="id_number" class="inputstyle1" autocomplete="off" type="text" name="idCardNo" placeholder="请输入身份证号" value="{$user.idCardNo ? $user.idCardNo :''}"/>
                        <span class="success"></span>
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">性别：</div>
                    <div class="formcontent pull-left" style="border:none;padding-top: 0.32rem">
                        {if condition="empty($user)" }
                        <span  style="margin-right: 1.2rem"> <input type="radio"  name="sex" value="男" class="radio"  checked>男</span>
                        <span  > <input type="radio"  name="sex" value="女" class="radio"  checked >女</span>
                        {/if}
                        {if condition="!empty($user)" }
                        <span  style="margin-right: 1.2rem"> <input type="radio"  name="sex" value="男" class="radio"  {if condition="$user.sex  eq '男' or  $user.sex eq ''" }checked {/if}>男</span>
                        <span  > <input type="radio"  name="sex" value="女" class="radio"  {if condition="$user.sex  eq '女' " }checked {/if}>女</span>

                        {/if}

                    </div>
                </div>
            </div>
            <style>
                #province,#city,#area{
                    position: relative;
                    margin-right: 0.256rem;
                    width:2.8rem;
                    border: 1px  solid #eee;
                    float: left;
                }
                .tab-item{
                    padding-left:  0.156rem;
                    height: 1rem;

                }
                .tab-item span{
                    height: 1rem; line-height: 1rem;
                }
                .tab-item img{
                    width:0.43933333rem ;
                }
                .sel-province,.sel-city,.sel-area{
                    padding-top: 0.512rem;
                    width:2.76rem;
                    display: none;
                    height: 10rem;
                    overflow: scroll;
                    background: white;
                    border: 1px  solid #eee;
                    position: absolute;
                    top: 1.032rem;
                    /*left:-0.03001rem;*/
                    z-index: 100;
                }

                .sel-province li,.sel-city li,.sel-area li{
                    width:100%;
                    margin-bottom: 0.156rem;
                    text-align: center;
                }
                .active span{
                    color: #22a0dc; ;
                    border-bottom: 1px solid  #22a0dc; ;
                }
                #backCard img,#fontCard img{
                    width: 100%;
                    height: 4.0133333rem;
                }
                .uploadFile{
                    opacity: 0;
                    filter: alpha(opacity=0);
                    width: 100%;
                    height: 4.0133333rem;
                    position: absolute;
                }
                .upload-title{
                    position: absolute;
                    top:55%;
                    left: 40%;
                }
            </style>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">办公区域：</div>
                    <div class="formcontent pull-left" style="border:none;;padding-left: 0">
                        <div id="area-info" style="position: absolute;">
                            <ul class="tab bg-white" >
                                <li  id="province">
                                    <div  class="tab-item   ">
                                        <span>选择省</span>
                                        <img src="__STATIC__/images/arrow_down.png"/>
                                    </div>
                                    <ul class="sel-province clearfix">
                                        {volist name="p" id="p"}
                                        <li class="pull-left {$city.pId ? $p.areaId==$city.pId ? 'active' : '' : ''}" >{$p.areaName}</li>
                                        {/volist}
                                    </ul>
                                </li>
                                <li   id="city">
                                    <div  class="tab-item  ">
                                        <span>选择市</span>
                                        <img src="__STATIC__/images/arrow_down.png"/>
                                    </div>
                                    <ul  class="sel-city clearfix">
                                        {volist name="d" id="d"}
                                        <li class="pull-left {$city.dId ? $d.areaId==$city.dId ? 'active' : '' : ''}">{$d.areaName}</li>
                                        {/volist}
                                    </ul>
                                </li>
                                <li  id="area">
                                    <div  class="tab-item   ">
                                        <span>选择区</span>
                                        <img src="__STATIC__/images/arrow_down.png"/>
                                    </div>
                                    <ul class="sel-area clearfix">
                                        {volist name="c" id="c"}
                                        <li class="pull-left {$city.areaId ? $c.areaId==$city.areaId ? 'active' : '' : ''}" data-value="{$city.areaId}">{$c.areaName}</li>
                                        {/volist}
                                    </ul>
                                </li>
                            </ul>
                        </div>

                        <script>
                            $(function(){
                                $("input[name='districtId']").val($('.sel-area').children('.active').attr('data-value'))
                                $('#province span').html($('.sel-province').children('.active').text());
                                $('#city span').html($('.sel-city').children('.active').text());
                                $('#area span').html($('.sel-area').children('.active').text());
                                //获取市
                                $()
                                $('.tab-item').on('click',function(){
                                    $('.tab li ul').hide();
                                    $('.tab-item span').removeClass('active');
                                    $('.tab-item').children('img').attr('src','__STATIC__/images/arrow_down.png');
                                    if($(this).hasClass('active')){
                                    }else {
                                        $(this).children('span').addClass('active');
                                        $(this).children('img').attr('src','__STATIC__/images/selected.png');
                                        var selected = $(this).parent().attr('id');
                                        if(selected == 'province'){
                                            $('.sel-province ').show();
                                        }
                                        if(selected == 'city'){
                                            $('.sel-city ').show();
                                        }
                                        if(selected == 'area'){
                                            $('.sel-area ').show();
                                        }
                                    }
                                });
                                $('.tab li ul li').on('click',function(){
                                    $('.tab-item').children('img').attr('src','__STATIC__/images/arrow_down.png');
                                    $(this).parent().children('li').removeClass('active');;
                                    $(this).addClass('active');
                                    if($(this).parent().hasClass('sel-province')){
                                        $('#province span').html($(this).text());
                                        $('.sel-province ').hide();
                                    }
                                    if($(this).parent().hasClass('sel-city')){
                                        if( $('#province span').html()  == '选择省'){
                                            layer.open({
                                                content:'请先选择省'
                                                ,skin: 'msg'
                                                ,time:3 //2秒后自动关闭
                                            });
                                        }else {
                                            $('#city span').html($(this).text());
                                        }
                                        $('.sel-city ').hide();
                                    }
                                    if($(this).parent().hasClass('sel-area')){
                                        if( $('#city span').html()  == '选择市'){
                                            layer.open({
                                                content:'请先选择省、市'
                                                ,skin: 'msg'
                                                ,time:3 //2秒后自动关闭
                                            });
                                        }else {
                                            $('#area span').html($(this).text());
                                            $("input[name='districtId']").val($('.sel-area').children('.active').attr('data-value'))
                                        }
                                        $('.sel-area ').hide();
                                    }

                                });
                            });
                        </script>
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">身份标签：</div>
                    <div class="formcontent pull-left"  >
                        <input tabindex="1"  id="id_tag"   class="inputstyle1" autocomplete="off" type="text" name="starLevelLink" placeholder="请输入身份标签" value="{$user.starLevelLink ? $user.starLevelLink :''}" />
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">行业经验：</div>
                    <div class="formcontent pull-left"  >
                        <input tabindex="1"  id="year"  class="inputstyle1" autocomplete="off" type="text" name="industryExperience" placeholder="请输入行业经验（年）" value="{$user.industryExperience ? $user.industryExperience :''}"/>
                    </div>
                </div>
            </div>
            <div class="form-content " id="multiselect">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">服务分类：</div>
                    <div class="formcontent pull-left clearfix" style="border:none;padding-top: 0.32rem;padding-left: 0;height: auto;">
                        {if condition="empty($user)" }
                        {volist name="group1" id="v"}
                        <div class="pull-left service-box"> <input name="serviceCategoryId[]" type="checkbox" class="checkbox" value="{$v.serviceCategoryId ?? ''}" id="m{$v.serviceCategoryId}" />{$v.categoryName}</div>

                        {/volist}
                        {/if}
                        {if condition="!empty($user)" }
                        {volist name="group1" id="v"}

                        <div class="pull-left service-box"> <input name="serviceCategoryId[]" type="checkbox" value="{$v.serviceCategoryId ?? ''}" class="checkbox" id="m{$v.serviceCategoryId}"  {volist name="$user['providerGroup']" id="providerGroup"}  {if condition="$providerGroup.provideGroupId  eq $v.serviceCategoryId " }checked {/if} {/volist}/>{$v.categoryName}</div>
                        {/volist}
                        {/if}
                    </div>
                </div>
            </div>
            <script>
                $(function() {
                    fuxuan($("#multiselect"))
                    function fuxuan( fuxuan){
                        ipts = fuxuan.find("input[type='checkbox']");
                        var max = 2;
                        var min = 1;
                        var count = 0;
                        var arr = []
                        /*将默认选中的添加到数组中*/
                        $.each(ipts, function(index,value) {
                            if($(this).prop("checked")){
                                arr.push($(this));
                                count++;

                            }
                        });
                        /*判断是否有默认选中的，如果没有，默认第一个选中*/
                        if(count == 0){
                            ipts.eq(0).prop("checked",true);
                            arr[0] = ipts.eq(0);
                            count++;
                        }
                        $.each(ipts, function() {
                            $(this).on("click",function(){
                                if($(this).prop("checked")){
                                    count++;
                                    arr.push($(this));
                                    if(count>max){
                                        arr.shift().prop("checked",false);
                                        count--;
                                    }
                                }else {
                                    count--
                                    if(count < min){
                                        $(this).prop("checked",true);
                                        count++;
                                    }else{
                                        for(var i=0; i<arr.length; i++){
                                            if(!arr[i].prop("checked")){
                                                arr.splice(i,1);
                                            }else {
//
                                            }
                                        }
                                    }
                                }
                            });
                        });
                    }

//								multiselect($("#multiselect"));
                })
            </script>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">身份证正面照：</div>
                    <div class="formcontent pull-left" style="border:none;padding-top: 0.32rem;padding-left: 0;height: auto;position: relative;width: 9rem">

                        <input type="hidden" name="idCardFileId" value="{$user.idCardFileId ? $user.idCardFileId :''}" id="reviewFile3" >
                        <img src="{$user.idCardFilePath ? $user.idCardFilePath :'__STATIC__/images/backCard.png'}" width="100%" height="100%" style="border-radius: 5px;" id="reviewImg3" placeholder="请输入行业经验（年）" >
                    </div>
                </div>
                <script type="text/javascript">

                    $(function(){
//                    var url = '{:\\think\\Url::build("index/Upload/index","d=3")}';
//							layer_layer2("上传",url);
                        $('#reviewImg3').on('click',function(){
                            var url = 'uploadIndex?d=3';
                            layer_layer2("上传",url);
                        });
                        $('#reviewImg4').on('click',function(){
                            var url = 'uploadIndex?d=4';
                            layer_layer2("上传",url);
                        });
                        $('#reviewImg5').on('click',function(){
                            var url = 'uploadIndex?d=5';
                            layer_layer2("上传",url);
                        });
                        $('#reviewImg6').on('click',function(){
                            var url = 'uploadIndex?d=6';
                            layer_layer2("上传",url);
                        });
                    });
                </script>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">身份证反面照：</div>
                    <div class="formcontent pull-left" style="border:none;padding-top: 0.32rem;padding-left: 0;height: auto;position: relative;width: 9rem">
                        <input type="hidden" name="idCardBackFileId" value="{$user.idCardBackFileId ? $user.idCardBackFileId :''}" id="reviewFile4" >
                        <img src="{$user.idCardBackFilePath ? $user.idCardBackFilePath :'__STATIC__/images/backCard.png'}" width="100%" height="100%" style="border-radius: 5px;" id="reviewImg4" >
                    </div>
                </div>
            </div>
            <div class="form-content ">
                <div class="clearfix input-inline">
                    <div class="formtitle pull-left">头像：</div>
                    <div class="formcontent pull-left" style="border:none;padding-top: 0.32rem;height: auto;padding-left: 0">
                        <div id="headimg" class="edit" style="margin: 0">
                            <input type="hidden" name="headImgFileId" value="{$user.headImgFileId ? $user.headImgFileId :''}" id="reviewFile5" >
                            <div class="pic"><img src="{$user.headImgFilePath ? $user.headImgFilePath :'__STATIC__/images/head.jpg'}" id="reviewImg5" ></div>
                            <span  class="btn">上传头像</span>
                        </div>

                    </div>
                </div>
            </div>
            <div class="privider-button-div" style="padding-bottom: 0.812rem">
            <input type="button" value="下一步" class="privider-button" id="sublimit">
           </div>
        </form>
    </div>
</section>
<link rel="stylesheet" type="text/css" href="__STATIC__/js/upload/aui.css">
<link rel="stylesheet" href="__STATIC__/js/upload/intial.css">
<script type="text/javascript" src="__STATIC__/js/upload/hammer.min.js"></script>
<script type="text/javascript" src="__STATIC__/js/upload/lrz.all.bundle.js"></script>
<script type="text/javascript" src="__STATIC__/js/upload/iscroll-zoom-min.js"></script>
<script type="text/javascript" src="__STATIC__/js/upload/PhotoClip.js"></script>
<script>
    $(function(){
        $('#sublimit').on('click',function(){
            //检测身份证
            if( $('#reviewFile3').val()=='' || $('#reviewFile4').val()=='' ){

                layer.open({
                    content:'请上传身份证照片'
                    ,skin: 'msg'
                    ,time:2000 //2秒后自动关闭
                });
                return false;
            }
            //检测表单其他项
            var  res = searchSub();
            var url = window.location.href;
            if(res =='ok'){
                var link = $.ajax({
                    cache: true,
                    type: "POST",
                    url:"{:\\think\\Url::build('index/Supplier/checkStarLevelLink')}",
                    data:{starLevelLink:$('#id_tag').val()},
                    async: true,
                    error: function(request) {
                        layer.msg('查询失败', {
                            icon: 2,
                            time: 2000 //2秒关闭（如果不配置，默认是3秒）
                        });
                    },
                    success: function(data) {
                        if(data!='ok'){
                            layer.open({
                                content:"身份标签已存在"
                                ,skin: 'msg'
                                ,time:2000 //2秒后自动关闭
                            });
                            return false;
                        }else{
                            $.ajax({
                                cache: true,
                                type: "POST",
                                url: url,
                                data:$('#form1').serialize(),// 你的formid
                                async: true,
                                error: function(request) {
                                    layer.msg('提交', {
                                        icon: 2,
                                        time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                    });
                                },
                                success: function(data) {
                                    if(data.code =='ok'){
                                        window.location.href='personal1'+'?memberId='+data.memberId;
                                    }else {
                                        if(data.type =='smsCode'){
                                            layer.open({
                                                content:data.msg
                                                ,skin: 'msg'
                                                ,time:2000 //2秒后自动关闭
                                            });
                                        }else if(data.type =='providerName'){
                                            layer.open({
                                                content:data.msg
                                                ,skin: 'msg'
                                                ,time:2000 //2秒后自动关闭
                                            });
                                        }else if(data.type =='memberName'){
                                            layer.open({
                                                content:data.msg
                                                ,skin: 'msg'
                                                ,time:2000 //2秒后自动关闭
                                            });
                                        }else {
                                            layer.msg(data.msg, {
                                                icon: 2,
                                                time: 2000 //2秒关闭（如果不配置，默认是3秒）
                                            });
                                        }
                                    }
                                }
                            });
                        }
                    }
                });

            }else{
                //信息框
                //提示
                layer.open({
                    content:res
                    ,skin: 'msg'
                    ,time:2000 //2秒后自动关闭
                });
            }
        });
    });
</script>
</body>
</html>